<template>
	<div slot="customContent" style="width: 100%;">
		<div class="title">
			请如下图所示，将{{cardName}}插入自助机指定位置
		</div>
		<div class="conentImg" @click="devClick()">
			<img class="modelImg" src="@/assets/images/readcard/吉大读卡提示/zizhuji_img.png" />
			<div class="pointBoxtSfz">
				<div>
					<img class="kuangImg" src="@/assets/images/readcard/吉大读卡提示/kuang.png">
				</div>
				<img class="souzhiImg" src="@/assets/images/readcard/吉大读卡提示/shouzhi.gif" />
			</div>
		</div>
		<div class="bottomBox">
			<el-button type="primary" class="BtnTextHome" @click="goBackHome()">首页</el-button>
		</div>
		<vTipImgBox ref="tipBox"></vTipImgBox>
	</div>
</template>
<script>
	import {
		IdInfo,
		IDCardReader
	} from "@api/tools/Hardware.js";
	import {
		MessageBox
	} from "element-ui";
	export default {
		name: "sfz",
		props: {},
		data() {
			return {
				cardName: '',
				idReader: new IDCardReader(),
				idInfo: new IdInfo(),
				destroyed: false
			};
		},
		methods: {
			ReckonTime() {},
			devClick() {
				if (this.$global.isDevlopment) {
					this.gotoMzgh();
				}
			},
			//数据回调
			gotoMzgh() {
				this.$emit("ReadedIdInfo", "");
			},
			async BeginReadID() {
				console.log("%c BeginReadeID", "color:#01DFA5");
				if (this.destroyed) {
					return; // 防止页面关闭后 继续调用
				}
				///////////////////////////// 异步写法
				try {
					/** 读身份证 */
					let info = await this.idReader.Read();
					console.log(info, 'info!!')
					if (info.ID != "") {
						console.log('success!')
						this.idInfo = info;
						//存储身份刷卡信息  
						// {
						// 	"name": "林大晚",
						// 	"EN_name": "",
						// 	"gender": "男",
						// 	"nation": "汉",
						// 	"birthday": "19970821",
						// 	"address": "福建省厦门市湖里区殿前三路196号",
						// 	"cardID": "350681192704210512",
						// 	"issuingOrg": "厦门市公安局湖里分局",
						// 	"validStart": "20201106",
						// 	"validEnd": "20301106",
						// 	"cardVer": "",
						// 	"cardTag": "N",
						// 	"passCardID": "",
						// 	"signTimes": ""
						// }
						this.$store.dispatch("user/updateUserIdCardInfo", info);
						//前往下一个页面
						this.gotoMzgh();
					} else {
						this.timerhandle = setTimeout(() => this.BeginReadID(), 100);
					}
				} catch (e) {
					this.$refs.tipBox.init();
					// console.log(`%c error: ${e.message}`, "color:red");
					// MessageBox.alert("未检索到身份证，请重新操作。", {
					// 	confirmButtonText: "确定",
					// 	callback: action => {
					// 		// setTimeout(() => {
					// 		// 	this.$router.push({
					// 		// 		name: "homepage"
					// 		// 	});
					// 		// }, 500);
					// 	}
					// });
				}
			},
			async Initynk() {
				await this.ynkReader.Init(0x04, "FFFFFFFFFFFF");
				console.log("set成功");
			}
		},
		computed: {},
		components: {},
		mounted() {
			console.log("this.idReader")
			this.idReader
				.Open()
				.then(() => this.BeginReadID())
				.catch(e => {
					MessageBox.alert(e.message, '读卡错误', {
						confirmButtonText: "确定",
						callback: action => {
							// setTimeout(() => {
							// 	this.$router.push({
							// 		name: "homepage"
							// 	});
							// }, 300);
						}
					});
				});
		},
		created() {
			this.cardName = this.$route.query.cardName;
		},
		beforeDestroy() {
			this.idReader.Close();
			if (this.timerhandle != null) {
				clearTimeout(this.timerhandle);
				this.timerhandle = null;
			}
			this.destroyed = true;
		}
	};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
	@import "../../assets/css/skzs.scss";
</style>
